import _ from 'lodash';

const LEGEND_BOTTOM = 10;

export const getLegendRect = (ref: React.RefObject<HTMLElement>) => {
  const ele = ref.current as HTMLElement;
  const { width, height } = (ele as HTMLElement).getBoundingClientRect();
  return (
    legend: any,
    titleH: number,
  ): { top: number; left: number; width: number; height: number } => {
    if (!_.get(legend, 'show', false)) {
      return { top: 0, left: 0, width, height };
    }
    const position = _.get(legend, 'position', 'top');
    switch (position) {
      case 'top':
        return { top: titleH, left: 0, width, height };
      case 'bottom':
        return { top: titleH, left: 0, width, height };
      case 'left':
        return { top: height, left: 0, width, height };
      case 'right':
        return { top: 0, left: 0, width, height };
      default:
        return { top: 0, left: 0, width, height };
    }
  };
};

export const getLegendH = (legend, legendRectInfo) => {
  const isShowLegend = _.get(legend, 'show', false);

  const position = _.get(legend, 'position', 'top');
  switch (position) {
    case 'top':
      return isShowLegend ? legendRectInfo.height + LEGEND_BOTTOM : 0;
    case 'bottom':
      return isShowLegend ? legendRectInfo.height + LEGEND_BOTTOM : 0;
    default:
      return 0;
  }
};
